import React, { useCallback, useState } from 'react'
import WNavBar from '@components/global/navBar'
import StudyModel, { dateStr } from '@models/studyModel'
import WCell from '@components/global/cell/00'
import WRefresh from '@components/global/refresh'


interface PopInterface {
  title: string
  models: StudyModel[],
  type: string
}

const StudyList = (props: PopInterface) => {

  const [models, setModels] = useState(props.models)

  // @ts-ignore
  const loadData = useCallback(async (pageNum: number, pageSize: number) => {
    const listData = await StudyModel.loadList({
      pageNum,
      pageSize,
      type: props.type
    })
    const { list } = listData
    setModels((models) => [...models, ...list])
    return list
  }, [])


  return (
    <WNavBar title={props.title}>
      <WRefresh
        asyncLoad={loadData}
        dataArr={models}
        renderItem={(item) => (
          <WCell
            key={item._id}
            toPath={ `/conclusion/study/detail?id=${item._id}` }
            show={ dateStr(item) }
            title={item.title}
            detail={item.describe}
            icon={item.pic} />
        )}
      />
    </WNavBar>
  )
}
StudyList.getInitialProps = async ({ ctx }: any) => {
  // 获取所有的 banner 数据
  const listData = await StudyModel.loadList({
    type: ctx.query.type
  })

  return {
    title: `学子总结-${ctx.query.type}`,
    models: listData.list,
    type: ctx.query.type
  }
}

export default StudyList
